<template>
  <div class="base-echart" ref="baseEchartRef"></div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import type { EChartsOption } from 'echarts'
import useEcharts from '@/hooks/useEcharts'

interface EchartsType {
  options: EChartsOption
}
let props = defineProps<EchartsType>()
const baseEchartRef = ref()

onMounted(() => {
  let echartIns = useEcharts(baseEchartRef.value)
  echartIns.setOption(props.options)
})
</script>

<style lang="scss" scoped>
.base-echart {
  height: 400px;
}
</style>
